类: DashboardDesigner

dashboard.DashboardDesigner

Table of contents

构造方法

• constructor

方法

• addVisual
• addVisualByTemplateId
• destroy
• hideDataBindingPanel
• hideInspector
• initialize
• isDocumentDirty
• off
• on
• save
• setDatasetId
• showDataBindingPanel
• showInspector
• togglePreview

构造方法

constructor

• new DashboardDesigner()

方法

addVisual

▸ addVisual(visualName, width?, height?, left?, top?): Promise<string>

添加可视化组件到仪表板设计器

参数

名称	类型	描述
visualName	string	可视化组件名称 以下是一些内置的可视化组件名称, "richEditor", "picture","container", "tabContainer", "spreadChart", "mergedChart", "embeddedDashboard", "embeddedReport", "treeSlicer", "dateRangeSlicer", "comboBoxSlicer", "labelSlicer", "relativeDateSlicer", "dataRangeSlicer", "column", "stackedColumn", "percentStackedColumn", "rangeColumn", "bar", "stackedBar", "percentStackedBar", "rangeBar", "line""area", "stackedArea", "percentStackedArea", "rangeArea", "pie", "donut", "rose", "radialStackedBar", "stackedBarInPolar", "sunburst", "barInPolar", "radar", "filledRadar", "scatter", "bubble", "treeMap", "combined", "funnel", "gauge", "indicator", "KPI", "pivotTable", "dataTable", "kpiMatrix", "map", "webContent", "floorPlan", "card", "candlestick", "KpiKanban", etc. 如果添加的组件是自定义可视化组件，则组件名称由其作者定义
width?	number	组件宽度
height?	number	组件高度
left?	number	组件横坐标
top?	number	组件纵坐标

返回值

Promise<string>

示例代码

designer.addVisual( 
	visualName: 'column',
	width: 400,
	height: 300,
	left: 0,
	top: 0
);

---

addVisualByTemplateId

▸ addVisualByTemplateId(templateId, left?, top?): Promise<string>

添加模版作为可视化组件到仪表板设计器

参数

名称	类型	描述
templateId	string	可视化组件模版的id
left?	number	组件横坐标
top?	number	组件纵坐标

返回值

Promise<string>

示例代码

designer.addVisualByTemplateId( 
	templateId: '658f8e5c-81a2-4a0c-a016-84ba52368b29',
	left: 0,
	top: 0
);

---

destroy

▸ destroy(): void

释放仪表板设计器实例的资源

返回值

void

---

hideDataBindingPanel

▸ hideDataBindingPanel(): void

隐藏仪表板设计器的数据绑定面板

返回值

void

---

hideInspector

▸ hideInspector(): void

隐藏仪表板设计器的属性面板

返回值

void

---

initialize

▸ initialize(initOption): Promise<void>

初始化仪表板设计器

参数

名称	类型
initOption	DashboardDesignerInitOption

返回值

Promise<void>

示例代码

designer.initialize({
	container: document.querySelector("#dashboard"),
	defaults: {
	  datasetId
	},
	features: {
	  actionbarItems : ["focus","annotation","shareScenario"]
	},
	onLoaded: (docName) => { 
	  document.title = docName;
	}
});

---

isDocumentDirty

▸ isDocumentDirty(): boolean

获取当前仪表板文档的编辑状态

返回值

boolean

---

off

▸ off(eventType, eventHandler): void

取消监听仪表板事件

参数

名称	类型
eventType	DesignerEventType
eventHandler	(...args: any[]) => void

返回值

void

---

on

▸ on(eventType, eventHandler): void

用于监听仪表板事件

参数

名称	类型
eventType	DesignerEventType
eventHandler	(...args: any[]) => void

返回值

void

---

save

▸ save(option?): Promise<boolean>

保存当前仪表板文档

参数

名称	类型
option?	DocumentSaveOption

返回值

Promise<boolean>

示例代码

designer.save({
	name: 'xxxxx',
	categories: ['xx'],
	comment: 'xxxx',
	shouldPublish: true
});

---

setDatasetId

▸ setDatasetId(datasetId): void

指定当前可视化组件的数据集

参数

名称	类型	描述
datasetId	string	数据集 id.

返回值

void

---

showDataBindingPanel

▸ showDataBindingPanel(): void

显示仪表板设计器的数据绑定面板

返回值

void

---

showInspector

▸ showInspector(): void

显示仪表板设计器的属性面板

返回值

void

---

togglePreview

▸ togglePreview(option?): void

切换仪表板设计器的视图模式

参数

名称	类型
option?	DocumentSyncOption

返回值

void